<section class="Hui-article-box">
	<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
		<span class="c-gray en">&gt;</span>
		用户管理
		<span class="c-gray en">&gt;</span>
		用户列表 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px"
			href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont">&#xe68f;</i></a>
	</nav>
	<div class="Hui-article">
		<article class="cl pd-20">
			<form action="{:U('admin/user/index')}" method="get" class="form form-horizontal" id="form-admin-add">
				<div class="text-c"> 日期范围：
					<input type="text" onfocus="WdatePicker()" class="input-text Wdate" style="width:120px;" name="start_time" value="{$start_time}">
					-
					<input type="text" onfocus="WdatePicker()" class="input-text Wdate" style="width:120px;" name="end_time" value="{$end_time}">
					<input type="text" class="input-text" style="width:250px" placeholder="输入用户名" name="keywords" value="{$keywords}">
					<button type="submit" class="btn btn-success"><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
				</div>
			</form>
			<div class="cl pd-5 bg-1 bk-gray mt-20">
				<span class="l">
					<a href="{:U('admin/user/add')}" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 添加用户</a>
				</span>
				<span class="r">共有数据：<strong>{:count($list)}</strong> 条</span>
			</div>
			<table class="table table-border table-bordered table-bg">
				<thead>
					<tr>
						<th scope="col" colspan="9">员工列表</th>
					</tr>
					<tr class="text-c">
						<th width="40">ID</th>
						<th width="150">用户名</th>
						<th width="90">手机</th>
						<th width="150">邮箱</th>
						<th>角色</th>
						<th width="130">加入时间</th>
						<th width="100">操作</th>
					</tr>
				</thead>
				<tbody>
					<volist name="list" id="item1" key="key1" empty="$empty">
					<tr class="text-c">
						<td>{$item1['id']}</td>
						<td>{$item1['user_name']}</td>
						<td>{$item1['mobile']}</td>
						<td>{$item1['email']}</td>
						<td>
							<volist name="item1.role" id="item2" key="key2" empty="无">
								&emsp;{$item2['role_name']}
							</volist>
						</td>
						<td>{$item1['create_time']|date="Y-m-d H:i:s",###}</td>
						<td class="td-manage">		
							<a title="编辑" onClick="edit('{$item1[id]}')" class="ml-5" style="text-decoration:none"
								href="javascript:;"><i class="Hui-iconfont">&#xe6df;</i></a>
							<a title="删除" onClick="del('{$item1[id]}')" class="ml-5" style="text-decoration:none"
								href="javascript:;"><i class="Hui-iconfont">&#xe6e2;</i></a>
						</td>
					</tr>
					</volist>
				</tbody>
			</table>
		</article>
	</div>
</section>
<script type="text/javascript" src="__PUBLIC__/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/datatables/1.10.15/jquery.dataTables.min.js"></script>
<script type="text/javascript">
/*停用*/
function stop(obj, id) {
		layer.confirm('确认要停用吗？', function (index) {
			//此处请求后台程序，下方是成功后的前台处理……

			$.ajax({
				url: "{:U('admin/user/edit')}",
				type: 'post',
				data: {
					id: id,
					status: 0,
				},
				success: function (re) {
					if (re.code) {
						$(obj).parents("tr").find(".td-manage").prepend('<a onClick="start(this,' + id + ')" href="javascript:;" title="启用" style="text-decoration:none"><i class="Hui-iconfont">&#xe615;</i></a>');
						$(obj).parents("tr").find(".td-status").html('<span class="label label-default radius">已停用</span>');
						$(obj).remove();
						layer.msg('已停用!', { icon: 6, time: 1000 });
					} else {
						layer.msg('操作失败!', { icon: 5, time: 1000 });
					}

				}
			})


		});
	}
	/*启用*/
	function start(obj, id) {
		layer.confirm('确认要启用吗？', function (index) {
			//此处请求后台程序，下方是成功后的前台处理……
			$.ajax({
				url: "{:U('admin/user/edit')}",
				type: 'post',
				data: {
					id: id,
					status: 1,
				},
				success: function (re) {
					if (re.code) {
						$(obj).parents("tr").find(".td-manage").prepend('<a onClick="stop(this,' + id + ')" href="javascript:;" title="停用" style="text-decoration:none"><i class="Hui-iconfont">&#xe631;</i></a>');
						$(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
						$(obj).remove();
						layer.msg('已启用!', { icon: 6, time: 1000 });
					} else {
						layer.msg('操作失败!', { icon: 5, time: 1000 });
					}

				}
			})

		});
	}
	/*编辑*/
	function add(id) {
		location.href = "{:U('admin/user/add')}";
	}
	/*编辑*/
	function edit(id) {
		location.href = "{:U('admin/user/edit/id/" + id + "')}";
	}
	/*删除*/
	function del(id) {
		layer.confirm('用户删除须谨慎，确认要删除吗？', function (index) {
			location.href = "{:U('admin/user/del/id/" + id + "')}";
		});
	}
</script>